<template xmlns:v-on="http://www.w3.org/1999/xhtml">
    <div id="app" class="user">
        <div class="userNav commenNav">
            <div>
                <div :class="{iconImg:isiconImg,iconImgs:isiconImgs}" @click="codepage"></div>
                <div id="codemanage" @click="codepage" style="cursor: pointer">监管码管理</div>
                <div class="breadcrum"></div>
                <div>监管码生产</div>
            </div>
            <div class="userNavT">
                <div>
                    <input type="text" placeholder="输入药品名称开始搜索">
                    <div @click="searchfn"><img :src="searchImg" alt=""></div>
                </div>
            </div>
        </div>
        <div class="userCotent">
            <div class="basicInfo">
                <div style="overflow: visible;position: relative;">
                    <div><span style="float:left;color:#999;">药品信息</span><span :class="{colorRedFont:iscolorRedFont_1}" style="float:right">药品通用名称：</span></div>
                    <div>
                        <input placeholder="输入文字 模糊匹配" @keyup="keyboard_1" @blur="loseblur" :class="{colorRedBorder:iscolorRedBorder_1}" v-model="pillname"
                            type="text" style="width:320px;"></div>
                    <div v-show="warning_1" class="warnStyle">{{warn_1}}</div>
                    <ul id="fuzzySearchUl" v-show="isfuzzySearchUl">
                        <li v-for="(fuzzy,index) in fuzzySearchUllists" @click="selectFuzzy(index)">{{fuzzy.drugName}}</li>
                    </ul>
                </div>
                <div class="clear"></div>
                <div>
                    <div><span :class="{colorRedFont:iscolorRedFont_2}">药品规格：</span></div>
                    <div class="selectPickBox2">
                        <el-input :disabled="true" @keyup="keyboard_2" :class="{colorRedBorder:iscolorRedBorder_2}" v-model="drugSpecifi"></el-input>
                    </div>
                    <div v-show="warning_2" class="warnStyle">{{warn_2}}</div>
                </div>

            </div>
            <div class="basicInfo pillrule">
                <div>
                    <div><span style="float:left;color:#999;">包装关联</span><span style="float:right">包装级数：</span></div>
                    <div class="selectPickBox1">
                        <el-select disabled v-model="selectPackSreies" placeholder="请选择" @change="selectLeval">
                            <el-option v-for="(option,index) in PackSreies" :label="option.text" :value="option.value" :key="key">
                            </el-option>
                        </el-select>
                    </div>
                </div>
                <div v-show="isPackPro">
                    <div><span :class="{colorRedFont:iscolorRedFont_3}">包装比例：</span></div>
                    <div class="packPro">
                        <input maxlength="3" style="background: #eef1f6;" disabled @keyup="keyboard_3" type="text" v-model="packProportion_1" :class="{colorRedBorder:iscolorRedBorder_3}">:
                        <input maxlength="3" style="margin:0" @keyup="keyboard_4" type="text" v-model="packProportion_2" :class="{colorRedBorder:iscolorRedBorder_4}">
                        <span v-show="packInput_3">:<input maxlength="3" @keyup="keyboard_5" style="margin: 0;" type="text" v-model="packProportion_3" :class="{colorRedBorder:iscolorRedBorder_5}"></span>
                    </div>
                    <div v-show="warning_3" class="warnStyle">{{warn_3}}</div>
                </div>
                <div class="details">
                    <div></div>
                    <div>
                        <ul v-show="sanji">
                            <li class="firstLi">
                                <div>包装级别</div>
                                <div>每级数量</div>
                                <div>包装单位</div>
                            </li>
                            <li style="position: relative">
                                <div>3</div>
                                <div class="NumberPerLevel">
                                    <input maxlength="6" @keyup="keyboard_6" type="tel" v-model="NumberPerLevel_1" :class="{colorRedFont:iscolorRedFont_4}">
                                </div>
                                <div>大箱</div>
                                <div v-show="warning_4" class="warnStyle" style="position: absolute;right: -168px;top: 31px;border: none;">{{warn_4}}</div>
                            </li>
                            <li>
                                <div>2</div>
                                <div class="NumberPerLevel">
                                    <input style="background: #eef1f6;" disabled maxlength="10" @keyup="keyboard_7" type="tel" v-model="NumberPerLevel_2" :class="{colorRedFont:iscolorRedFont_5}">
                                </div>
                                <div>箱</div>
                            </li>
                            <li>
                                <div>1</div>
                                <div class="NumberPerLevel">
                                    <input style="background: #eef1f6;" disabled maxlength="10" @keyup="keyboard_8" type="tel" v-model="NumberPerLevel_3" :class="{colorRedFont:iscolorRedFont_6}">
                                </div>
                                <div>盒</div>
                            </li>
                            <li>
                                <div style="height: 50px;line-height: 50px;width:450px;">所需监管码总数：<b style="font-weight: normal">{{codeTotal_3}}</b></div>
                            </li>
                        </ul>
                        <ul v-show="erji">
                            <li class="firstLi">
                                <div>包装级别</div>
                                <div>每级数量</div>
                                <div>包装单位</div>
                            </li>
                            <li style="position: relative">
                                <div>2</div>
                                <div class="NumberPerLevel">
                                    <input maxlength="6" @keyup="keyboard_7" type="tel" v-model="NumberPerLevel_2" :class="{colorRedFont:iscolorRedFont_5}">
                                </div>
                                <div>箱</div>
                                <div v-show="warning_5" class="warnStyle" style="position: absolute;right: -168px;top: 31px;border: none;">{{warn_5}}</div>
                            </li>
                            <li>
                                <div>1</div>
                                <div class="NumberPerLevel">
                                    <input style="background: #eef1f6;" disabled maxlength="10" @keyup="keyboard_8" type="tel" v-model="NumberPerLevel_3" :class="{colorRedFont:iscolorRedFont_6}">
                                </div>
                                <div>盒</div>
                            </li>
                            <li>
                                <div style="height: 50px;line-height: 50px;width:450px;">所需监管码总数：<b style="font-weight: normal">{{codeTotal_2}}</b></div>
                            </li>
                        </ul>
                        <ul v-show="yiji">
                            <li class="firstLi">
                                <div>包装级别</div>
                                <div>每级数量</div>
                                <div>包装单位</div>
                            </li>
                            <li style="position: relative">
                                <div>1</div>
                                <div class="NumberPerLevel">
                                    <input maxlength="6" @keyup="keyboard_8" type="tel" v-model="NumberPerLevel_3" :class="{colorRedFont:iscolorRedFont_6}">
                                </div>
                                <div>盒</div>
                                <div v-show="warning_6" class="warnStyle" style="position: absolute;right: -168px;top: 31px;border: none;">{{warn_6}}</div>
                            </li>
                            <li>
                                <div style="height: 50px;line-height: 50px;width:450px;">所需监管码总数：<b style="font-weight: normal">{{codeTotal_1}}</b></div>
                            </li>
                        </ul>
                    </div>
                </div>
                <div>
                    <div></div>
                    <div>
                        <div style="margin-left: 40px;">包装关联图：</div>
                        <div class="relatedImgBox">
                            <img :src="relatedImg" alt="">
                        </div>
                    </div>
                </div>
            </div>
            <div>
                <input type="button" value="保存" @click="codeaddBtn" :disabled='saveBtn'>
            </div>

        </div>
        <!--提示框-->
        <div id="tipMsg" v-show="istipMsg">
            <div class="approval-leave-bg">
                <div class="tipBox">
                    <div>
                        <p style="color:#fff;font-size: 18px;margin-left: 10px;">提示</p>
                    </div>
                    <div>
                        <p style="padding:40px 0;text-align: center;width:100%;">已编辑的内容未保存，确定进行其他操作？</p>
                        <div class="yesNo">
                            <input type="button" value="取消" id="yes" @click="cancle">
                            <input type="button" value="确定" id="no" @click="pillSure">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</template>
<script>
    import { mapActions } from 'vuex'
    export default {
        name: 'user',
        data() {
            return {
                // isfuzzySearchUl_1: true,
                // isfuzzySearchUl_2: false,
                sanji: false,
                erji: false,
                yiji: true,
                key: '',
                drugId: '',
                isfuzzySearchUl: false,
                fuzzySearchUllists: [
                ],
                fuzzySearchUllist: [
                ],
                relatedImg: '/static/img/yiji.png',
                packInput_3: false,
                isPackPro: false,
                codeTotal_1: 0,
                codeTotal_2: 0,
                codeTotal_3: 0,
                packProportion_1: 1,
                packProportion_2: 1,
                packProportion_3: 1,
                NumberPerLevel_1: 0,
                NumberPerLevel_2: 0,
                NumberPerLevel_3: 0,
                drugSpecifi: '',
                warning_1: false,
                warn_1: '',
                warning_2: false,
                warn_2: '',
                warning_3: false,
                warn_3: '',
                warning_4: false,
                warn_4: '',
                warning_5: false,
                warn_5: '',
                warning_6: false,
                warn_6: '',
                iscolorRedFont_1: false,
                iscolorRedBorder_1: false,
                iscolorRedFont_2: false,
                iscolorRedBorder_2: false,
                iscolorRedFont_3: false,
                iscolorRedBorder_3: false,
                iscolorRedFont_4: false,
                iscolorRedBorder_4: false,
                iscolorRedBorder_5: false,
                iscolorRedFont_5: false,
                iscolorRedFont_6: false,
                iscolorRedFont_7: false,
                iscolorRedFont_8: false,
                toPath: '',
                istipMsg: false,
                intercept: false,
                pillname: '',
                isiconImg: true,
                isiconImgs: false,
                searchImg: '/static/img/搜索.png',
                searchImgs: '/static/img/搜索点击.png',
                saveBtn:false,
                users: [
                ],
                // loading: true,、

                selectPackSreies: '1',
                PackSreies: [
                    { text: '1', value: '1' },
                    { text: '2', value: '2' },
                    { text: '3', value: '3' },
                ],
                variable: true,
                mate: '',
                fuzz: false,
            }
        },
        watch: {
            NumberPerLevel_1: function (m) {
                var g = /^[1-9]*[1-9][0-9]*$/;
                // if (this.selectPackSreies == '1') {
                //     this.codeTotal = Number(this.NumberPerLevel_1)
                // }
                if (this.NumberPerLevel_1 % this.packProportion_1 !== 0) {
                    this.iscolorRedFont_4 = true
                    this.warning_4 = true
                    this.warn_4 = '请输入正确的数值!'
                } else if (!g.test(this.NumberPerLevel_1)) {
                    this.iscolorRedFont_4 = true
                    this.warning_4 = true
                    this.warn_4 = '请输入正整数!'
                } else {
                    this.warning_4 = false
                    this.iscolorRedFont_4 = false
                    // if (this.selectPackSreies == '2') {
                    //     this.NumberPerLevel_2 = (m / this.packProportion_1) * this.packProportion_2
                    //     this.codeTotal = Number(this.NumberPerLevel_1) + Number(this.NumberPerLevel_2)
                    // } else 
                    if (this.selectPackSreies == '3') {
                        this.NumberPerLevel_2 = (m / this.packProportion_1) * this.packProportion_2
                        this.NumberPerLevel_3 = (m / this.packProportion_1) * this.packProportion_2 * this.packProportion_3
                        this.codeTotal_3 = Number(this.NumberPerLevel_1) + Number(this.NumberPerLevel_2) + Number(this.NumberPerLevel_3)
                    }
                }
            },
            NumberPerLevel_2: function (n) {
                var g = /^[1-9]*[1-9][0-9]*$/;
                if (!g.test(this.NumberPerLevel_2)) {
                    this.iscolorRedFont_5 = true
                    this.warning_5 = true
                    this.warn_5 = '请输入正整数!'
                } else {
                    this.warning_5 = false
                    this.iscolorRedFont_5 = false
                    if (this.selectPackSreies == '2') {
                        this.NumberPerLevel_3 = n * this.packProportion_2
                        this.codeTotal_2 = Number(this.NumberPerLevel_2) + Number(this.NumberPerLevel_3)
                    }

                }
            },
            NumberPerLevel_3: function (m) {
                var g = /^[1-9]*[1-9][0-9]*$/;
                if (!g.test(this.NumberPerLevel_3)) {
                    this.iscolorRedFont_6 = true
                    this.warning_6 = true
                    this.warn_6 = '请输入正整数!'
                } else {
                    this.warning_6 = false
                    this.iscolorRedFont_6 = false
                    this.codeTotal_1 = Number(this.NumberPerLevel_3)
                }
            },
            // 监视模糊匹配搜索框
            pillname: function (a) {
                var self = this
                 if (self.variable == false) {
                    self.variable = true
                    return
                } else {
                    self.fuzzySearchlist({
                        drugName: a
                    }).then((data) => {
                        console.log(data, '模糊搜索')
                        if (data.code == 200) {
                            if (data.data.length == 0) {
                                self.iscolorRedFont_1 = self.iscolorRedBorder_1 = self.warning_1 = true
                                self.warn_1 = '没有此药品!'
                            }else{
                            self.isfuzzySearchUl = true
                            self.fuzzySearchUllists = []
                            for (var i = 0; i < data.data.length; i++) {
                                self.fuzzySearchUllists.push({ drugName: data.data[i].drugName })
                            }
                            self.fuzzySearchUllist = data.data
                            for (var i = 0; i < data.data.length; i++) {
                                if (self.pillname == data.data[i].drugName) {
                                   
                                    self.iscolorRedFont_1 = self.iscolorRedBorder_1 = self.warning_1 = false
                                     return self.fuzz = true
                                }else{
                                self.iscolorRedFont_1 = self.iscolorRedBorder_1 = self.warning_1 = true
                                self.warn_1 = '没有此药品'
                                }
                            }
                            
                            // if (self.fuzz == false) {
                               
                            // }
                            }
                            
                        } else {
                            self.isfuzzySearchUl = false
                        }
                    }).catch(msg => console.log(msg))
                }
               
            }
        },
        beforeRouteLeave(to, from, next) {
            this.toPath = to.path
            if (this.intercept == false) {
                this.istipMsg = true
            } else if (this.intercept == true) {
                this.istipMsg = false
                next()
            }
        },
        created: function () {
            // if (!!window.ActiveXObject || "ActiveXObject" in window){
            //     this.isfuzzySearchUl_1 = false
            //     this.isfuzzySearchUl_2 = true
            // } else{
            //     this.isfuzzySearchUl_1 = true
            //     this.isfuzzySearchUl_2 = false
            // }
            // this.getproducesite()
        },
        methods: {
            loseblur: function () {
                // this.isfuzzySearchUl = false
            },
            // 选中模糊匹配的内容
            selectFuzzy(index) {
                this.NumberPerLevel_1 = this.NumberPerLevel_2 = this.NumberPerLevel_3 = 0
                this.codeTotal_1 = this.codeTotal_2 = this.codeTotal_3 = 0
                this.warning_1 = false
                this.iscolorRedFont_1 = false
                this.iscolorRedBorder_1 = false
                this.variable = false
                this.pillname = this.fuzzySearchUllist[index].drugName
                this.isfuzzySearchUl = false
                for (let i = 0; i < this.fuzzySearchUllist.length; i++) {
                    if (this.fuzzySearchUllist[i].specificationUnit == '1') {
                        this.fuzzySearchUllist[i].specificationUnit = '片'
                    } else if (this.fuzzySearchUllist[i].specificationUnit == '2') {
                        this.fuzzySearchUllist[i].specificationUnit = '袋'
                    }
                    else if (this.fuzzySearchUllist[i].specificationUnit == '3') {
                        this.fuzzySearchUllist[i].specificationUnit = '粒'
                    }
                    else if (this.fuzzySearchUllist[i].specificationUnit == '4') {
                        this.fuzzySearchUllist[i].specificationUnit = '瓶'
                    }
                    else if (this.fuzzySearchUllist[i].specificationUnit == '5') {
                        this.fuzzySearchUllist[i].specificationUnit = '支'
                    }

                    if (this.fuzzySearchUllist[i].minPackagingUnit == '1') {
                        this.fuzzySearchUllist[i].minPackagingUnit = '盒'
                    } else if (this.fuzzySearchUllist[i].minPackagingUnit == '2') {
                        this.fuzzySearchUllist[i].minPackagingUnit = '袋'
                    }
                    else if (this.fuzzySearchUllist[i].minPackagingUnit == '3') {
                        this.fuzzySearchUllist[i].minPackagingUnit = '箱'
                    }
                }
                this.drugSpecifi = this.fuzzySearchUllist[index].minPackagingNumber + this.fuzzySearchUllist[index].specificationUnit + '/' + this.fuzzySearchUllist[index].minPackagingUnit
                this.selectPackSreies = this.fuzzySearchUllist[index].packingLevel
                this.drugId = this.fuzzySearchUllist[index].id

            },
            selectLeval: function () {
                if (this.selectPackSreies == '1') {
                    this.yiji = true
                    this.erji = false
                    this.sanji = false
                    this.isPackPro = false
                    this.relatedImg = '/static/img/yiji.png'
                } else if (this.selectPackSreies == '2') {
                    this.yiji = false
                    this.erji = true
                    this.sanji = false
                    this.isPackPro = true
                    this.packInput_3 = false
                    this.relatedImg = '/static/img/erji.png'
                } else if (this.selectPackSreies == '3') {
                    this.yiji = false
                    this.erji = false
                    this.sanji = true
                    this.isPackPro = true
                    this.packInput_3 = true
                    this.relatedImg = '/static/img/sanji.png'
                }
            },
            panduan() {
                if (this.pillname == null || this.pillname == '') {
                    this.iscolorRedFont_1 = true
                    this.iscolorRedBorder_1 = true
                    return false
                }

                var g = /^[1-9]*[1-9][0-9]*$/;
                if (!g.test(this.packProportion_1)) {
                    this.iscolorRedFont_3 = true
                    this.warning_3 = true
                    this.warn_3 = '请输入正整数!'
                    return false
                }
                if (!g.test(this.packProportion_2)) {
                    this.iscolorRedFont_3 = true
                    this.warning_3 = true
                    this.warn_3 = '请输入正整数!'
                    return false
                }
                if (!g.test(this.packProportion_3)) {
                    this.iscolorRedFont_3 = true
                    this.warning_3 = true
                    this.warn_3 = '请输入正整数!'
                    return false
                }
                if (this.selectPackSreies == '1') {
                    if (!g.test(this.NumberPerLevel_3)) {
                        this.iscolorRedFont_6 = true
                        this.warning_6 = true
                        this.warn_6 = '请输入正整数!'
                        return false
                    }
                    if (this.warning_6 == true) {
                        return false
                    }
                }
                if (this.selectPackSreies == '2') {
                    if (!g.test(this.NumberPerLevel_2)) {
                        this.iscolorRedFont_5 = true
                        this.warning_5 = true
                        this.warn_5 = '请输入正整数!'
                        return false
                    }
                    if (!g.test(this.NumberPerLevel_3)) {
                        this.iscolorRedFont_6 = true
                        this.warning_5 = true
                        this.warn_5 = '请输入正整数!'
                        return false
                    }
                    if (this.warning_5 == true) {
                        return false
                    }
                }
                if (this.selectPackSreies == '3') {
                    if (!g.test(this.NumberPerLevel_1)) {
                        this.iscolorRedFont_4 = true
                        this.warning_4 = true
                        this.warn_4 = '请输入正整数!'
                        return false
                    }
                    if (!g.test(this.NumberPerLevel_2)) {
                        this.iscolorRedFont_5 = true
                        this.warning_4 = true
                        this.warn_4 = '请输入正整数!'
                        return false
                    }
                    if (!g.test(this.NumberPerLevel_3)) {
                        this.iscolorRedFont_6 = true
                        this.warning_4 = true
                        this.warn_4 = '请输入正整数!'
                        return false
                    }
                    if (this.warning_4 == true) {
                        return false
                    }
                }
                var regs = new RegExp("[.\u3000-\u303F\uFF00-\uFFEF\u3400-\u4DBF`~!@#$^&*()=|{}':;',\\[\\].<>/?~！@#￥……&*（）——|{}【】‘；：”“'。，、？%+_]+");
                if (regs.test(this.pillname)) {
                    this.iscolorRedFont_1 = true
                    this.iscolorRedBorder_1 = true
                    this.warning_1 = true
                    this.warn_1 = '不能输入特殊字符'
                    return false
                }
                if (this.warning_1 == true || this.warning_3 == true) {
                    return false
                }
            },
            cancle: function () {
                this.istipMsg = false
            },
            // 提示框确定
            pillSure() {
                this.intercept = true
                var url = this.toPath
                this.$router.push({
                    path: url
                })
            },
            codepage: function () {
                this.isiconImg = false
                this.isiconImgs = true
                document.querySelector("#codemanage").style.color = '#666'
                this.$router.push({
                    path: '/home/codemanage'
                })
            },
            searchfn: function () {
                this.searchImg = this.searchImgs
            },
            keyboard_1: function () {
                // this.iscolorRedFont_1 = false
                // this.iscolorRedBorder_1 = false
                // this.warning_1 = false
            },
            keyboard_2: function () {
                this.iscolorRedFont_2 = false
                this.iscolorRedBorder_2 = false
                this.warning_2 = false
            },
            keyboard_3: function () {
                this.NumberPerLevel_1 = this.NumberPerLevel_2 = this.NumberPerLevel_3 = 0
                var g = /^[1-9]*[1-9][0-9]*$/;
                if (!g.test(this.packProportion_1)) {
                    this.iscolorRedFont_3 = true
                    this.iscolorRedBorder_3 = true
                    this.warning_3 = true
                    this.warn_3 = '请输入正整数!'
                } else {
                    this.iscolorRedFont_3 = false
                    this.iscolorRedBorder_3 = false
                    this.warning_3 = false
                }
            },
            keyboard_4: function () {
                this.NumberPerLevel_1 = this.NumberPerLevel_2 = this.NumberPerLevel_3 = 0
                var g = /^[1-9]*[1-9][0-9]*$/;
                if (!g.test(this.packProportion_2)) {
                    this.iscolorRedFont_3 = true
                    this.iscolorRedBorder_4 = true
                    this.warning_3 = true
                    this.warn_3 = '请输入正整数!'
                } else {
                    this.iscolorRedFont_3 = false
                    this.iscolorRedBorder_4 = false
                    this.warning_3 = false
                }
            },
            keyboard_5: function () {
                this.NumberPerLevel_1 = this.NumberPerLevel_2 = this.NumberPerLevel_3 = 0
                var g = /^[1-9]*[1-9][0-9]*$/;
                if (!g.test(this.packProportion_3)) {
                    this.iscolorRedFont_3 = true
                    this.iscolorRedBorder_5 = true
                    this.warning_3 = true
                    this.warn_3 = '请输入正整数!'
                } else {
                    this.iscolorRedFont_3 = false
                    this.iscolorRedBorder_5 = false
                    this.warning_3 = false
                }
            },
            keyboard_6: function () {
            },
            keyboard_7: function () {
            },
            keyboard_8: function () {
            },
            codeaddBtn() {
                if (this.panduan() == false) {
                    return
                } else {
                    this.saveBtn = true;
                    var shuju = {
                    }
                    if (this.selectPackSreies == '1') {
                        shuju.supervisionLevelInfos = [
                            {
                                amount: this.NumberPerLevel_3,
                                drugId: this.drugId,
                                packingLevel: 1,
                                packingUnit: '1'
                            }
                        ]
                        shuju.supervisionWrapper = {
                            drugId: this.drugId,
                            packingScale: "",
                            supervisionCodeNumber: this.codeTotal_1
                        }
                    } else if (this.selectPackSreies == '2') {
                        shuju.supervisionLevelInfos = [
                            {
                                amount: this.NumberPerLevel_2,
                                drugId: this.drugId,
                                packingLevel: 2,
                                packingUnit: '2'
                            },
                            {
                                amount: this.NumberPerLevel_3,
                                drugId: this.drugId,
                                packingLevel: 1,
                                packingUnit: '1'
                            }
                        ],
                            shuju.supervisionWrapper = {
                                drugId: this.drugId,
                                packingScale: this.packProportion_1 + ':' + this.packProportion_2,
                                supervisionCodeNumber: this.codeTotal_2
                            }
                        // shuju.supervisionWrapper.packingScale = this.packProportion_1 + ':' + this.packProportion_2
                    } else if (this.selectPackSreies == '3') {
                        shuju.supervisionLevelInfos = [
                            {
                                amount: this.NumberPerLevel_1,
                                drugId: this.drugId,
                                packingLevel: 3,
                                packingUnit: '3'
                            },
                            {
                                amount: this.NumberPerLevel_2,
                                drugId: this.drugId,
                                packingLevel: 2,
                                packingUnit: '2'
                            },
                            {
                                amount: this.NumberPerLevel_3,
                                drugId: this.drugId,
                                packingLevel: 1,
                                packingUnit: '1'
                            }
                        ],
                            shuju.supervisionWrapper = {
                                drugId: this.drugId,
                                packingScale: this.packProportion_1 + ':' + this.packProportion_2 + ':' + this.packProportion_3,
                                supervisionCodeNumber: this.codeTotal_3
                            }

                        // shuju.supervisionWrapper.packingScale = this.packProportion_1 + ':' + this.packProportion_2 + ':' + this.packProportion_3
                    }
                    this.codeaddBtnlist({ paramJson: JSON.stringify(shuju) }).then((data) => {
                        console.log(data, '监管码生产')
                        if (data.code == 200) {
                            this.intercept = true
                            this.$router.push({
                                path: '/home/codemanage'
                            })
                            this.$message.success('保存成功')
                        } else {
                            this.$message(data.message)
                        }
                        this.saveBtn = false;
                    }).catch(msg => console.log(msg))
                }
            },
...mapActions(['codeaddBtnlist','fuzzySearchlist','codeaddBtnlist'])    
        }
    }

</script>
<style scoped>
    .userCotent {
        margin-top: 10px;
        /*min-width: 1289px;*/
        background: #fff;
        width: 100%;
        height: calc(100vh - 150px);
        overflow-x: hidden;
        overflow-y: scroll;
    }
    
    .userCotent>div {
        padding: 30px 0 10px 40px;
        border-bottom: 1px solid #DDD;
    }
    
    .userCotent>div:nth-child(3) {
        border-bottom: none;
    }
    
    .userCotent>div>div>div {
        float: left
    }
    
    .userCotent input {
        width: 160px;
        height: 32px;
        border: 1px solid #DDD;
        border-radius: 5px;
    }
    
    .userNav>div:nth-child(1) {
        height: 25px;
        display: flex;
        margin-left: 35px;
        align-items: center;
    }
    
    .userNav>div:nth-child(1) input {
        background: #43dce7;
        border-radius: 5px;
        font-size: 14px;
        color: #fff;
        margin-left: 60px;
        width: 80px;
        height: 32px;
    }
    
    .userNav>div:nth-child(1) div {
        line-height: 25px;
        margin-left: 5px;
        padding: 0;
        color: #333;
        font-size: 14px;
    }
    
    .userNavT {
        width: 360px;
        display: flex;
        align-items: center;
        margin-right: 45px;
    }
    
    .userNavT>div:nth-child(1) {
        display: flex;
        border: 1px solid #e0e0e0;
        border-radius: 5px;
        height: 34px;
        padding: 5px 10px;
        width: 360px;
        justify-content: space-between;
    }
    
    .userNavT>div:nth-child(1) input {
        border: none;
        outline: none;
        width: 100%;
        color: #333;
        font-size: 14px;
    }
    
    .userNavT>div:nth-child(1) img {
        width: 20px;
        height: 20px;
    }
    
    .userNavT>div:nth-child(1) div {
        line-height: 25px;
        margin-left: 5px;
        padding: 0;
        color: #333;
        font-size: 14px;
    }
    
    .userNavT>div:nth-child(1) div span {
        padding: 0!important;
    }
    
    .userNavT>div:nth-child(2) {
        color: #888;
        font-size: 14px;
        cursor: pointer;
    }
    
    .user {
        position: relative;
    }
    
    .iconImg {
        background: url('/static/img/icons.png') no-repeat;
        width: 24px;
        height: 24px;
        background-position: -79px -110px;
    }
    
    .iconImgs {
        background: url('/static/img/icons.png') no-repeat;
        width: 24px;
        height: 24px;
        background-position: -108px -110px;
    }
    
    .basicInfo>div {
        margin: 20px 0;
        overflow: hidden;
    }
    
    .basicInfo>div div:nth-child(1) {
        width: 280px;
        height: 32px;
        line-height: 32px;
    }
    
    .basicInfo>div div:nth-child(1) span {
        float: right;
        color: #333;
    }
    
    .basicInfo>div div:nth-child(2) input {
        padding: 0 10px;
        margin-left: 40px;
    }
    
    .userCotent>div:nth-child(3) input[type="button"] {
        width: 150px;
        color: #fff;
        background: #43dce7;
        border-radius: 5px;
        margin-left: 330px;
    }
    
    select {
        width: 160px;
        border: 1px solid #DDD;
        height: 32px;
        border-radius: 5px;
        margin-left: 40px;
    }
    
    .breadcrum {
        background: url(/static/img/icons.png) no-repeat;
        width: 25px;
        height: 25px;
        background-position: -138px -39px;
    }
    
    .colorRedBorder {
        border: 1px solid #E74343!important;
    }
    
    .colorRedFont {
        color: #E74343!important;
    }
    
    .warnStyle {
        line-height: 32px;
        margin-left: 10px;
        color: #E74343;
    }
    
    .selectPickBox1 {
        width: 160px;
    }
    
    .selectPickBox2 {
        width: 320px;
    }
    
    .selectPickBox1,
    .selectPickBox2 {
        height: 32px;
        overflow: hidden;
        position: relative;
        border: 1px solid #dddddd;
        border-radius: 5px;
        margin-left: 40px;
    }
    
    .selectPickBox1 .el-select {
        width: 162px!important;
        margin-left: -1px;
        margin-top: -1px;
    }
    
    .selectPickBox2 .el-input {
        width: 322px!important;
        margin-left: -1px;
        margin-top: -1px;
    }
    
    .details>div:nth-child(2) {
        margin-left: 40px;
        border-top: 1px solid #DDD;
        border-left: 1px solid #DDD;
    }
    
    .details>div:nth-child(2) ul li div {
        float: left;
        width: 150px;
        line-height: 64px;
        height: 64px;
        border-bottom: 1px solid #DDD;
        border-right: 1px solid #DDD;
    }
    
    .firstLi div {
        height: 32px!important;
        line-height: 32px!important;
        width: 150px;
    }
    
    .details>div:nth-child(2) ul li {
        text-align: center;
        width: 450px;
    }
    
    .NumberPerLevel input {
        width: 100%;
        height: 99%;
        border: none;
        margin: 0!important;
        text-align: center;
    }
    
    .packPro input {
        width: 48px;
        text-align: center;
    }
    
    .relatedImgBox {
        margin-left: 40px;
        margin-top: 8px;
        width: 240px;
        height: 120px;
    }
    
    .relatedImgBox img {
        width: 100%;
        height: 100%;
    }
    
    #fuzzySearchUl {
        position: absolute;
        top: 32px;
        left: 320px;
        width: 320px;
        box-shadow: 0 2px 3px #D8D9D9;
        border: 1px solid #DDDDDD;
        background: #FFF;
        z-index: 100
    }
    
    #fuzzySearchUl li {
        height: 30px;
        line-height: 30px;
    }
    
    #fuzzySearchUl li:hover {
        background: #F2F2F2;
    }
    
    .pillrule input {
        border-radius: 0;
    }
</style>